import Vue from 'vue'
import Router from 'vue-router'
// 引入组件配置路由
// import Recommend from 'components/recommend/recommend'
// import Singer from 'components/singer/singer'
// import Rank from 'components/rank/rank'
// import Search from 'components/search/search'
// import SingerDetail from 'components/singer-detail/singer-detail'
// import Disc from 'components/disc/disc'; // 歌单详情页

// import TopList from 'components/top-list/top-list'; // 排行榜详情

// import UserCenter from 'components/user-center/user-center'; // 用户组件
Vue.use(Router);

// 路由懒加载异步加载
const Recommend = (resolve) => {
  import('components/recommend/recommend').then((module) => {
    resolve(module)
  })
};
const Singer = (resolve) => {
  import('components/singer/singer').then((module) =>{
    resolve(module)
  })
};
const Rank = (resolve) => {
  import('components/rank/rank').then((module) => {
    resolve(module)
  })
};
const Search = (resolve) => {
  import('components/search/search').then((module)=> {
    resolve(module)
  })
};
const SingerDetail = (resolve) => {
  import('components/singer-detail/singer-detail').then((module) => {
    resolve(module)
  })
};
const Disc = (resolve) => {
  import('components/disc/disc').then((module) => {
    resolve(module)
  })
};
const TopList = (resolve) => {
  import('components/top-list/top-list').then((module) => {
    resolve(module)
  })
};
const UserCenter = (resolve) => {
  import('components/user-center/user-center').then((module) => {
    resolve(module)
  })
};

export default new Router({
  routes: [
    { // 主页路由重定向
      path: '/',
      redirect: '/recommend' // redirect 路由重定向，当路由是主页 / 的时候重定向到 /recommend路由页面
    },
    {
      path: '/recommend', // 推荐
      name: 'recommend',
      component: Recommend,// 页面显示时才会加载,有点像懒加载(页面懒加载页面模块)
      children: [
        {
          path: ':id',
          component: Disc
        }
      ]
    },
    {
      path: '/singer', // 歌手
      name: 'singer',
      component: Singer,
      children:[ // 子路由
        {
          path:':id',
          component: SingerDetail
        }
      ]
    },
    {
      path: '/rank',
      name: 'rank',
      component: Rank,
      children: [
        {
          path: ':id',
          component: TopList
        }
      ]
    },
    {
      path: '/search',
      name: 'search',
      component: Search,
      children:[ // 子路由
        {
          path:':id',
          component: SingerDetail
        }
      ]
    },
    {
      path: '/user',
      component: UserCenter
    }
  ]
})
